import React, { Component } from 'react';
import {
  StyleSheet, Text, View, TouchableOpacity,
  PixelRatio, Image, FlatList, ScrollView
} from "react-native";
import { GLOBAL } from '../../../config/global';
import { style } from '../../../theme/style';
import { Common } from '../../../component/common/Common.js';
import HTTP from '../../../utils/http'
import { API, API_GENERATE } from '../../../config/api';
import { PageStatusIndex } from '../../../component/page-status/PageStatusIndex';

const scale = GLOBAL.SCALE;

export class reanddeDetail extends Component {
  static navigationOptions = ({ navigation, navigationOptions }) => {
    return {
      headerTitle: '收发货明细',
      headerTintColor: style.color.white,
      headerLeft: <Common type="headLeft" onPress={() => { navigation.goBack() }} color='#fff' />,
      headerRight: (<Image style={style.head.headRightEmpty} source={require('../../../imgs/goBackEmpty.png')} />),
      headerStyle: {  // 头部整体样式 
        elevation: 0,
        borderBottomWidth: 0,
        backgroundColor: style.color.themeColor
      },
      headerTitleStyle: {
        flex: 1,
        textAlign: 'center'
      }
    }
  };
  constructor(props) {
    super(props);    
    let {data} = this.props.navigation.state.params||{}
    this.state = {
      res:{
        priceConfirmHeadVO:{},
        priceConfirmLineVO:{}
      },
      data:{}
    }
    this.confirmId= data.confirmId
    this.confirmLineId= data.confirmLineId
  }
  async componentWillMount () {
    await this._initPage();
  }

  // 初始化数据
  _initPage = async () => {
    this.setState({
      status: this.reload ? 'loading' : 'data',
      refreshIcon: !this.reload,
    })
		let res = await HTTP.POST(API_GENERATE(API.SECOND_SOURCE_DETAIL), {
      confirmId:this.confirmId,
      confirmLineId:this.confirmLineId,
    })  
    if (res) {
      this.setState({
        status: res ? 'data' : 'empty',
        res: res,
        refreshIcon: false,
      })
    } else {
      this.setState({
        refreshIcon: false,
        status: 'error'
      })
    }
  }

  render () {
    let {res,status} = this.state
    let {priceConfirmHeadVO,priceConfirmLineVO} = res
    return (
      <View style={{flex:1}}>
      {status == 'data'?
        <ScrollView style={styles.container}>
      <Text style={{marginTop:20*scale,marginBottom:10*scale,fontSize:14*scale,color:'#080808'}}>收发货单号：{priceConfirmLineVO.sourceCode}</Text>
      <Text style={styles.text}>订单号：{priceConfirmLineVO.orderId}</Text>
      <View style={styles.dataShopContent}>
        <View style={styles.dataShopHorizontal}>
          <Text style={styles.dataShopTitle}>客户名称</Text>
          <Text style={styles.dataShopText}>{priceConfirmHeadVO.companyName||'-'}</Text>
        </View>
        <View style={styles.dataShopHorizontal}>
          <Text style={styles.dataShopTitle}>收发货日期</Text>
          <Text style={styles.dataShopText}>{priceConfirmLineVO.stockDate?priceConfirmLineVO.stockDate.substring(0,11):'-'}</Text>
        </View>
        <View style={styles.dataShopHorizontal}>
          <Text style={styles.dataShopTitle}>交货方式</Text>
          <Text style={styles.dataShopText}>{priceConfirmLineVO.deliveryTypeName||'-'}</Text>
        </View>
      </View>
      <View style={styles.dataShopContent}> 
        <View style={styles.dataShopHorizontal}>
          <Text style={styles.dataShopTitle}>商品名称</Text>
          <Text style={styles.dataShopText}>{priceConfirmLineVO.goodsName||'-'}</Text>
        </View>
        <View style={styles.dataShopHorizontal}>
        <Text style={styles.dataShopTitle}>收发货量</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.quantity?(priceConfirmLineVO.quantity+'吨'):'-'}</Text>
      </View>
      <View style={styles.dataShopHorizontal}>
        <Text style={styles.dataShopTitle}>结算量</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.settlementQuantity?(priceConfirmLineVO.settlementQuantity+'吨'):'-'}</Text>
      </View>
      </View>
      <View style={styles.dataShopContent}>
      <View style={styles.dataShopHorizontal}>
        <Text style={styles.dataShopTitle}>仓库</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.warehouseName||'-'}</Text>
      </View>
      <View style={styles.dataShopHorizontal}></View>
      <View style={styles.dataShopHorizontal}></View>
    </View>
      <View style={[styles.bottomHorizontal,{marginTop:25*scale}]}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>结算公示</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.priceFormlaName?priceConfirmLineVO.priceFormlaName:'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>暂定价</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.tempPrice?priceConfirmLineVO.tempPrice+'/吨':'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>结算单价</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.settlePrice?priceConfirmLineVO.settlePrice+'/吨':'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>收货方地址</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.destAddressName?priceConfirmLineVO.destAddressName:'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>发货方地址</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.srcAddressName?priceConfirmLineVO.srcAddressName:'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>价格确认人</Text>
        <Text style={styles.dataShopText}>{priceConfirmHeadVO.auditByName?priceConfirmHeadVO.auditByName:'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>确认时间</Text>
        <Text style={styles.dataShopText}>{priceConfirmHeadVO.auditTime?priceConfirmHeadVO.auditTime.substring(0,11):'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>是否关联有效结算单</Text>
        <Text style={styles.dataShopText}>{priceConfirmLineVO.settlementQuantity?(priceConfirmLineVO.settlementQuantity>0?'是':'否'):'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>认价类型</Text>
        <Text style={styles.dataShopText}>{priceConfirmHeadVO.confirmType?(priceConfirmHeadVO.confirmType==='1'?'商品认价':'收发货认价'):'-'}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>业务员（部门）</Text>
        <Text style={styles.dataShopText}>{priceConfirmHeadVO.staffName?priceConfirmHeadVO.staffName:'-'}{priceConfirmHeadVO.organName?('（'+priceConfirmHeadVO.organName+'）'):''}</Text>
      </View>
      <View style={styles.bottomHorizontal}>
        <Text style={[styles.dataShopTitle,{marginRight:16*scale}]}>认价编码</Text>
        <Text style={styles.dataShopText}>{priceConfirmHeadVO.confirmId?priceConfirmHeadVO.confirmId:'-'}</Text>
      </View>
    </ScrollView>:null
      }
      {
        status != 'data' ? (<PageStatusIndex status={status} emptyText={'暂无数据'} onErrorPress={this._onErrorRefresh} />) : null
      }
      </View>
    )
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: style.color.bgGray,
    paddingHorizontal:20*scale
  },
  text:{
    fontSize:14*scale,
    color:'#080808',
    marginBottom:10*scale
  },
  dataShopContent:{
    flexDirection:'row',
    alignItems:'flex-start',
    marginTop:14*scale
  },
  dataShopHorizontal:{
    flex:1,
    
  },
  dataShopTitle:{
    fontSize: 12* scale,
    color:'#000000',
    marginBottom:5*scale,
    opacity:0.7,
    lineHeight:15*scale
  },
  dataShopText:{
    fontSize: 12* scale,
    color:'#000000',
    fontWeight:'600',
    marginBottom:5*scale,
    lineHeight:15*scale
  },
  bottomHorizontal:{
    marginTop:12*scale,
    flexDirection:'row',
    alignItems:'flex-start',
  }
})